<template>
	<view class="main">
		<view class="items">
			<view class="item" v-for="i in data">
				<view class="left">
					<view class="name">{{i.name}}</view>
					<view class="address">{{i.address}}</view>
					<view class="status">
						<view class="label">状态：</view>
						<view class="red" v-if="i.status == 0">待收集</view>
						<view class="red" v-else>待收集</view>
					</view>
				</view>
				<view class="right">
					<view class="button" @click="goto(i)">开始采集</view>
				</view>
			</view><!-- item end -->
		</view>
	</view><!-- main end-->
</template>

<script>
	// import {image_upload} from "@/api/common";
	import {getList} from "@/api/community.js";
	import {
		toLogin
	} from '@/libs/login.js';
	import {
		mapState,
		mapGetters
	} from "vuex";
	export default {
		computed: {
			...mapGetters({
				isLogin: 'isLogin'
			})
		},
		data() {
			return {
				data:[],
				page:1,
				limit:10,
				status:false,
			}
		},
		onLoad(options) {
			this.loadData();
			
		},
		onShareTimeline() {
			return {
				title: '采集问题',
				//分享朋友圈的参数
				query: "isShare=1&id=",
			}
		},
		onShareAppMessage(){
		},
		created() {
			
		},
		onShow:function(){
			
			
		},
		onHide:function(){
			if(this.hasCache){
			}
		},
		onUnload:function(){
			uni.removeStorageSync('storage_key');
			// console.info('onunload');
			// if(this.hasCache){
			// 	console.info('开始缓存onunload');
			// 	this.saveCache();
			// }
		},
		onPullDownRefresh() {
			this.page = 1;
			this.loadData();
		},
		onReachBottom: function() {
			this.page++;
			this.loadData();
		},
		methods: {
			goto(item){
				if (this.isLogin == false) {
					toLogin()
					return;
				}
				uni.navigateTo({
					url:'/pages/index/data?id='+item.id+'&name='+item.name+'&address='+item.address
				});
			},
			loadData(){
				let that = this;
				if (that.status) return;
				getList({
					page: this.page,
					limit: this.limit
				}).then((res)=>{
					uni.hideLoading();
					if(res.status == 200){
						console.info(res)
						
						let datasNew = [];
						let len = res.data.count;
						datasNew = that.data.concat(res.data.list);
						that.page++;
						that.data = datasNew;
						that.status = limit > len;
						that.page = that.page;
					}else{
						uni.showToast({
							title:res.msg
						});
					}
				}).catch((error)=>{
					uni.hideLoading(); 
					console.log(error);
				});
			}
		}
	}
</script>

<style lang="scss">
	page {
	  width: 100%;
	  height: 100%;
	  background-color: #f1f1f1;
	}
	.main {
		display: flex;
		flex-direction: column;
		
		
		.items{
			display: flex;
			flex-direction: column;
			padding: 30rpx 0rpx;
			
			.item{
				display: flex;
				flex-direction: row;
				justify-content: space-between;
				margin: 0rpx 30rpx 15rpx 30rpx;
				padding: 30rpx;
				background-color: white;
				.left{
					display: flex;
					flex-direction: column;
					flex: 1;
					margin-right: 30rpx;
					.name{
						font-size: 32rpx;
						font-weight: bold;
						color: black;
					}
					.address{
						font-size: 24rpx;
						color: darkgray;
						margin-top: 10rpx;
					}
					.status{
						display: flex;
						flex-direction: row;
						margin-top: 10rpx;
						.label{
							font-size: 24rpx;
							color: darkgray;
						}
						.red{
							font-size: 24rpx;
							color: red;
						}
					}
				}
				.right{
					display: flex;
					flex-direction: row;
					align-items: center;
					width: 160rpx;
					.button{
						width: 160rpx;
						height:60rpx;
						color: #0685FF;
						border: 1rpx solid #0685FF;
						border-radius: 30rpx;
						text-align: center;
						line-height: 60rpx;
					}
				}
			}
		}
	}
</style>
